<!DOCTYPE HTML>
<html lang="en-US">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		
		<title>Guild Home</title>
		
		<link rel="stylesheet" href="/lib/normalize.min.css" />
		<link rel="stylesheet" href="/lib/font-awesome/css/font-awesome.min.css" />
		<link rel="stylesheet" href="/css/guild.css" />
		<!--[if lte IE7]>
			<link rel="stylesheet" href="/css/guild.ie7.css" />
		<![endif]-->
		
		<script src="/lib/jquery.min.js"></script>
		<script>
			var messageMaxLength = {{messageMaxLength}};
			
			$().ready(function() {
				$('#menu a').click(function(e) {
					var page = $(this).attr('data-page');
					if (!page)
						return;
					
					e.preventDefault();
					
					$('#menu a').removeClass('current');
					$('.page').removeClass('current').hide();
					
					$(this).addClass('current');
					$('#' + page).addClass('current').show();
				});
				
				
				$('.messages textarea').keyup(updateCounter);
				$('.messages textarea').each(updateCounter);
				
				setTimeout(function() {
					$('.notification.disappear').fadeOut();
				}, 4000);
				
				$('input[type=submit][data-confirm]').click(function() {
					return confirm($(this).attr('data-confirm'));
				});
			});
			
			function closeWindow() {
				window.open('', '_self', '');
				window.close();
			}
			
			function updateCounter() {
				var $this = $(this);
				var area = $this.attr('data-area');
				if (!area)
					return;
					
				var len = $this.val().length;
				$('span[data-area='+area+']').html(messageMaxLength - len);
			}
		</script>
	</head>
	<body>
		<div id="main">
			<div class="inner">
				<div class="title"><a href="{{url}}"><i class="fa fa-fort-awesome" aria-hidden="true"></i> AuraProject</a></div>
				<div class="notifications">
					{{#if success}}<div class="notification success disappear"><i class="fa fa-check-circle" aria-hidden="true"></i><span>{{success}}</span></div>{{/if}}
					{{#if error}}<div class="notification error disappear"><i class="fa fa-exclamation-circle" aria-hidden="true"></i><span>{{error}}</span></div>{{/if}}
					{{#if guild.Disbanded}}<div class="notification info"><i class="fa fa-exclamation" aria-hidden="true"></i><span>The guild has been disbanded and will get removed shortly.</span></div>{{/if}}
					{{#if member.IsDeclined}}<div class="notification info"><i class="fa fa-exclamation" aria-hidden="true"></i><span>You will be removed from the guild shortly.</span></div>{{/if}}
					<noscript><div class="notification info"><i class="fa fa-exclamation" aria-hidden="true"></i><span>This page requires JavaScript being enabled.</span></div></noscript>
				</div>
				<div id="menu">
					{{#if guild.Disbanded}}
					{{#else}}
						<ul>
							{{#if member.IsMember}}
								<li><a title="Home" href="#" data-page="home" class="current"><i class="fa fa-home" aria-hidden="true"></i><span>Home</span></a></li>
								<li><a title="Members" href="#" data-page="members"><i class="fa fa-users" aria-hidden="true"></i><span>Members</span></a></li>
								{{#if member.IsLeader}}
									<li><a title="Settings" href="#" data-page="settings"><i class="fa fa-cogs" aria-hidden="true"></i><span>Settings</span></a></li>
								{{#else}}
									<li><a title="Leave guild" href="{{url}}&leaveGuild=1"><i class="fa fa-sign-out" aria-hidden="true"></i><span>Leave guild</span></a></li>
								{{/if}}
							{{#elif member.IsApplicant}}
								<li><a title="Cancel application" href="{{url}}&cancelApplication=1"><i class="fa fa-sign-out" aria-hidden="true"></i><span>Cancel application</span></a></li>
							{{/if}}
						</ul>
					{{/if}}
				</div>
				<div id="home" class="page current">
					<table>
						<tr>
							<th>Established</th>
							<td>{{guild.EstablishedDate:yyyy-MM-dd}}</td>
						</tr>
						<tr>
							<th>Server</th>
							<td>{{guild.Server}}</td>
						</tr>
						<tr>
							<th>Type</th>
							<td>{{guild.Type}} ({{guild.Visibility}})</td>
						</tr>
						<tr>
							<th>Level</th>
							<td>{{guild.Level}}</td>
						</tr>
						<tr>
							<th>Leader</th>
							<td>{{guild.LeaderName}}</td>
						</tr>
						<tr>
							<th>Members</th>
							<td>{{guild.MemberCount}}/{{guild.MaxMembers}}</td>
						</tr>
						{{#if member.IsMember}}
							<tr>
								<th>Guild Points</th>
								<td>{{guild.Points:n0}}</td>
							</tr>
							<tr>
								<th>Gold</th>
								<td>{{guild.Gold:n0}}</td>
							</tr>
						{{/if}}
					</table>
				</div>
				<div id="members" class="page">
					<table>
						{{#each members}}
							<tr>
								<td class="name rank{{this.Rank}}">{{this.Name}}</td>
								{{#if this.IsLeader}}
									<td class="options"></td>
								{{#elif this.IsApplicant}}
									{{#if member.IsLeaderOrOfficer}}
										<td class="options">
											<a title="Accept application" href="{{url}}&acceptApplication={{this.CharacterId}}"><i class="fa fa-check" aria-hidden="true"></i><span>Accept</span></a>
											<a title="Decline application" href="{{url}}&declineApplication={{this.CharacterId}}"><i class="fa fa-times" aria-hidden="true"></i><span>Decline</span></a>
										</td>
									{{#else}}
										<td class="options"></td>
									{{/if}}
								{{#elif this.IsOfficer}}
									{{#if member.IsLeader}}
										<td class="options"><a title="Remove from guild" href="{{url}}&removeMember={{this.CharacterId}}"><i class="fa fa-sign-out" aria-hidden="true"></i><span>Remove</span></a></td>
									{{#else}}
										<td class="options"></td>
									{{/if}}
								{{#else}}
									{{#if member.IsLeaderOrOfficer}}
										<td class="options"><a title="Remove from guild" href="{{url}}&removeMember={{this.CharacterId}}"><i class="fa fa-sign-out" aria-hidden="true"></i><span>Remove</span></a></td>
									{{#else}}
										<td class="options"></td>
									{{/if}}
								{{/if}}
							</tr>
						{{/each}}
					</table>
				</div>
				{{#if member.IsLeaderOrOfficer}}
					<div id="settings" class="page">
						<h1>Messages</h1>
						<form action="" method="post">
							<table class="messages">
								<tr>
									<td>
										<b>Intro</b> (<span class="charCounter" data-area="intro">{{messageMaxLength}}</span>)<br/>
										<textarea name="intro" data-area="intro" maxlength="{{messageMaxLength}}">{{guild.IntroMessage}}</textarea><br/>
									</td>
									<td>
										<b>Welcome</b> (<span class="charCounter" data-area="welcome">{{messageMaxLength}}</span>)<br/>
										<textarea name="welcome" data-area="welcome" maxlength="{{messageMaxLength}}">{{guild.WelcomeMessage}}</textarea><br/>
									</td>
								</tr>
								<tr>
									<td>
										<b>Leaving</b> (<span class="charCounter" data-area="leaving">{{messageMaxLength}}</span>)<br/>
										<textarea name="leaving" data-area="leaving" maxlength="{{messageMaxLength}}">{{guild.LeavingMessage}}</textarea><br/>
									</td>
									<td>
										<b>Rejection</b> (<span class="charCounter" data-area="rejection">{{messageMaxLength}}</span>)<br/>
										<textarea name="rejection" data-area="rejection" maxlength="{{messageMaxLength}}">{{guild.RejectionMessage}}</textarea><br/>
									</td>
								</tr>
							</table>
							<input type="submit" value="Save" />
						</form>
						
						<h1>Leader</h1>
						<form action="" method="post">
							<input type="text" name="leader" value="{{guild.LeaderName}}" /> <input type="submit" value="Save" />
						</form>
						
						<h1>Functions</h1>
						<form action="" method="post">
							<input type="submit" name="disband" value="Disband guild" data-confirm="Do you want to disband the guild?" />
							<input type="submit" name="levelUp" title="{{levelUpRequirements}}" {{#if levelUpDisabled}}disabled="disabled"{{/if}} value="Level up" data-confirm="Do you want level up the guild?" />
						</form>
					</div>
				{{/if}}
			</div>
		</div>
	</body>
</html>
